<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button>按钮1</button>
    <button>按钮2</button>
    <button>按钮3</button>

    <script>
        let  btns = document.querySelectorAll("button");
        for (let i = 0; i < btns.length; i++) {
            // let i=0;

            btns[i].onclick = function () {
                console.log(i)
            }

        }


        // {
        //     let i=0;
        //     btns[i].onclick = function () {
        //         console.log(i)
        //     }


        // }

        // {
        //     let i=1;
        //     btns[i].onclick = function () {
        //         console.log(i)
        //     }



            
        // }


        // {
        //     let i=2;
        //     btns[i].onclick = function () {
        //         console.log(i)
        //     }


        // }



// var i=0;
//  {       
//             btns[i].onclick = function () {
//                 console.log(i)
//             }

//         }

//         var i=1;
//         {
        
//         btns[i].onclick = function () {
//             console.log(i)
//         }


//     }

//     var i=2;


//     {
        
//         btns[i].onclick = function () {
//             console.log(i)
//         }


//     }

//     var i=3;






    </script>
</body>

</html>